{extend name="property/public/insidePageBase" /}
{block name="title"}编辑租赁{/block}
{block name="css"}
{__block__}
<style>
    body{ margin:0; }
    .layui-iconpicker-body.layui-iconpicker-body-page .hide {display: none;}
    body .layui-iconpicker .layui-iconpicker-icon-item{ width: 20.1%; }
    body{  background-color: #ffffff; }
    .layui-upload-img-box { float:left;  margin-bottom: 2px;margin-right: 2px; background: #e0e0e0;  padding: 1px; }
    .layui-upload-img {width: 82px; height: 82px; margin-bottom: 1px;}
</style>
{/block}
{block name="body"}
<div class="layuimini-container">
    <div class="layuimini-main">
        <div class="layui-form layui-form-pane">
            <div class="layui-form-item">
                <div class="layui-row">
                    <div class="layui-col-xs5">
                        <div class="layui-form-item">
                            <label class="layui-form-label indispensable">房屋信息</label>
                            <div class="layui-input-block">
                                <input type="text" value="{$info['full_room_name']??''}" disabled placeholder="房屋信息" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-xs4">
                        <div class="layui-form-item">
                            <label class="layui-form-label">支付手续费</label>
                            <div class="layui-input-block">
                                <select name="out_fee_flag"  lay-search>
                                    <option value="">--请选择--</option>
                                    <option value="1" {:isset($info['out_fee_flag']) ? $info['out_fee_flag'] == 1 ? 'selected' : '' : ''}>甲方承担</option>
                                    <option value="2" {:isset($info['out_fee_flag']) ? $info['out_fee_flag'] == 1 ? 'selected' : '' : ''}>乙方承担</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-xs3">
                        <div class="layui-input-group">
                            <div class="layui-input-split layui-input-prefix indispensable">合同开始时间&nbsp;&nbsp;</div>
                            <input type="text" name="start_date" value="{$info['start_date']??''}" disabled placeholder="起租日期" class="layui-input">
                        </div>
                    </div>
                </div>

                <div class="layui-row">
                    <div class="layui-col-xs4">
                        <div class="layui-form-item" pane="">
                            <label class="layui-form-label">涨租模式</label>
                            <div class="layui-input-block">
                                <input type="radio" name="is_rose" lay-filter="is-rose" autocomplete="off" value="1" title="自动" {:isset($info['is_rose']) ? $info['is_rose'] == 1 ? 'checked' : '' : ''}>
                                <input type="radio" name="is_rose" lay-filter="is-rose" autocomplete="off" value="2" title="手动" {:isset($info['is_rose']) ? $info['is_rose'] == 2 ? 'checked' : '' : ''}>
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-xs5">
                        <div class="layui-form-item">
                            <div class="layui-inline is-rose" {if $info['is_rose'] == 2}style="display: none"{/if}>
                                <div class="layui-input-group">
                                    <div class="layui-input-split layui-input-prefix">每间隔</div>
                                    <input type="text" maxlength="1" name="next_years" value="{$info['next_years']??''}"  placeholder="间隔年限" autocomplete="off"  class="layui-input" oninput="value=value.replace(/[^\d]/g,'');lessNum(this)">
                                    <div class="layui-input-split layui-input-suffix">年租金上涨</div>
                                    <input type="text" maxlength="5" name="next_rose_rate" value="{$info['next_rose_rate']??''}"  placeholder="上涨比例" autocomplete="off"  class="layui-input" oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')">
                                    <div class="layui-input-split layui-input-suffix"> % / 月</div>
                                </div>
                            </div>
                            <div class="layui-inline rend-is-rose"  {if $info['is_rose'] == 1}style="display: none"{/if}>
                                <div class="layui-input-group">
                                    <input type="text" name="next_rose_date" value="{$info['next_rose_date']??''}" placeholder="请输入计租时间" autocomplete="off"  class="layui-input rent-time" oninput="value=value.replace(/[^\d]/g,'');lessNum(this)">
                                    <div class="layui-input-split layui-input-suffix">起租金递增至</div>
                                    <input type="text" name="next_rose_rent" value="{$info['next_rose_rent']??''}" placeholder="请输入租金金额" autocomplete="off"  class="layui-input " oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')">
                                    <div class="layui-input-split layui-input-suffix"> / 月</div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-xs3">
                        <div class="layui-input-group">
                            <div class="layui-input-split layui-input-prefix indispensable">合同结束时间&nbsp;&nbsp;</div>
                            <input type="text" name="start_date" value="{$info['end_date']??''}" disabled placeholder="起租日期" class="layui-input" autocomplete="off">
                        </div>
                    </div>
                </div>

                <div class="layui-form">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">账单每月</label>
                            <div class="layui-input-block" >
                                <div class="layui-input-inline" style="width: 60px">
                                    <select name="bill_add_day">
                                        {for name='i' start='1' end='32' step='1'}
                                        <option value="{$i}" {if $i == $info['bill_add_day']}selected{/if}>{$i}</option>
                                        {/for}
                                    </select>
                                </div>
                                <div class="layui-form-mid">日生成</div>
                                <div class="layui-input-inline" style="width: 100px">
                                    <select name="bill_month">
                                        <option value="1" {if $info['bill_month'] == 1}selected{/if}>本月账单</option>
                                        <option value="2" {if $info['bill_month'] == 2}selected{/if}>次月账单</option>
                                        <option value="2" {if $info['bill_month'] == 3}selected{/if}>上月账单</option>
                                    </select>
                                </div>
                                <div class="layui-input-inline" style="width: 60px">
                                    <select name="bill_pay_day">
                                        {for name='i' start='1' end='32' step='1'}
                                        <option value="{$i}" {if $i == $info['bill_pay_day']}selected{/if}>{$i}</option>
                                        {/for}
                                    </select>
                                </div>
                                <div class="layui-form-mid">日内支付，超时每日收取账单总金额</div>
                                <div class="layui-input-inline" style="width: 80px">
                                    <input type="text" maxlength="5" name="overdue_fine"  value="{$info['overdue_fine']??''}"  autocomplete="off"  class="layui-input" placeholder="滞纳金比例" oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')">
                                </div>
                                <div class="layui-form-mid">%的滞纳金，最高不超过账单总额</div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="layui-row">
                    <div class="layui-col-xs4">
                        <div class="layui-form-item" pane="">
                            <label class="layui-form-label">合同类型</label>
                            <div class="layui-input-block">
                                <input type="radio" name="sign_type" lay-filter="sign_type" value="2" title="纸质" {:isset($info['sign_type']) ? $info['sign_type'] == 2 ? 'checked' : '' : ''}>
                                <input type="radio" name="sign_type" lay-filter="sign_type" value="1" title="电子" {:isset($info['sign_type']) ? $info['sign_type'] == 1 ? 'checked' : '' : ''}>
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-xs4">
                        <div class="layui-form-item" pane="">
                            <label class="layui-form-label">审核方式
                                <i class="layui-icon layui-icon-question hoverTips"  lay-text="
                                    <p>自动审核：提交合同资料自动审核</p>
                                    <p>人工确认：提交合同资料后，由其它部分或上一级行政人员核对资料后审核</p>">
                                </i>
                            </label>
                            <div class="layui-input-block">
                                <input type="radio" name="sign_audit" value="1" title="自动" {:isset($info['sign_audit']) ? $info['sign_audit'] == 1 ? 'checked' : '' : ''}>
                                <input type="radio" name="sign_audit" value="2" title="人工" {:isset($info['sign_audit']) ? $info['sign_audit'] == 2 ? 'checked' : '' : ''}>
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-xs4">
                        <div class="layui-form-item" pane="">
                            <label class="layui-form-label">退租方式
                                <i class="layui-icon layui-icon-question hoverTips"  lay-text="
                                    <p>自动：合同达到截止日期时自动结束合同</p>
                                    <p>手动：合同达到截止日期时不会结束，需要手动结束合同</p>">
                                </i>
                            </label>
                            <div class="layui-input-block">
                                <input type="radio" name="end_method" autocomplete="off" value="1" title="自动" {:isset($info['end_method']) ? $info['end_method'] == 1 ? 'checked' : '' : ''}>
                                <input type="radio" name="end_method" autocomplete="off" value="2" title="手动" {:isset($info['end_method']) ? $info['end_method'] == 2 ? 'checked' : '' : ''}>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-row">
                    <div class="layui-col-xs4" id="sign_type_esign" {if $info['sign_type'] == 2}style="display: none"{/if}>
                        <div class="layui-form-item">
                            <label class="layui-form-label required">合同模版</label>
                            <div class="layui-input-block">
                                <select name="contract_template_id" id="">
                                    <option value="">--请选择--</option>
                                </select>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item" id="sign_type_image" {if $info['sign_type'] == 1}style="display: none"{/if}>
                    <div class="layui-form-item">
                        <label class="layui-form-label">租赁图片</label>
                        <div class="layui-input-block" id="image_info">
                            <button type="button" class="layui-btn" id="upload_imgs" lay-data="{field: 'picture',data:{dir:'contract/basic', field:'picture'}}">上传图片</button>
                            <div class="layui-upload-list" id="img_show"></div>
                            {foreach $info['picture'] as $k=>$v}
                            <div class="layui-upload-img-box" id="{:md5($v)}-{$k}">
                                <img src="{$v}" class="layui-upload-img checkPictureByImg">
                                <input type="hidden" name="picture[]" value="{$v}">
                                <p>
                                    <a class="layui-btn layui-btn-xs cftoggleUpload" style="float: left" lay-data="{field: 'picture',data:{dir:'contract/basic', field:'picture', replace_upload_index: '{:md5($v)}-{$k}'}}">修改</a>
                                    <a class="layui-btn layui-btn-xs layui-btn-danger" onclick="this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode);" style="float: right">删除</a>
                                </p>
                            </div>
                            {/foreach}
                        </div>
                    </div>
                </div>
                <div class="layui-form-item layui-form-text">
                    <label class="layui-form-label">租赁备注</label>
                    <div class="layui-input-block">
                        <textarea placeholder="请输入备注说明" class="layui-textarea" name="remark">{$info['remark']??''}</textarea>
                    </div>
                </div>
                <div class="layui-form-item layui-hide">
                    <button type="button" class="layui-btn layui-btn-primary replaceUploadImg toggleUpload" lay-data="{}"></button>
                    <button class="layui-btn" lay-submit lay-filter="submitBtn" id="submitBtn">提交</button>
                </div>
            </div>
        </div>
    </div>
</div>
{/block}
{block name="js"}
{__block__}
<script>
    layui.use(['form', 'layer', 'laydate'], function () {
        var form = layui.form,layer = layui.layer,laydate = layui.laydate;
        $('.uploadImg').selectImages({
            confirm:function(res,elem,data) {
                $('#' + data.field).val(res[0].src);
                $('.' + data.field).attr('src',res[0].src)
            }
        });
        laydate.render({
            elem: '.laydate-type-start-end'
            ,range: ['#startDate', '#endDate']
        });
        laydate.render({
            elem: '.rent-time'
        });


        $('#upload_imgs').selectImages({
            confirm:function(res,elem) {
                for(var i in res) {
                    index = (new Date()).getTime()+''+i;
                    $('#img_show').append('<div class="layui-upload-img-box" id="'+index+'">' +
                        '<img src="' + res[i].src + '" class="layui-upload-img checkPictureByImg">' +
                        '<input type="hidden" name="picture[]" value="' + res[i].src + '">' +
                        '<p>' +
                        '<a class="layui-btn layui-btn-xs cftoggleUpload" style="float: left" lay-data="{field: \'picture\',data:{dir:\'contract/basic\', field:\'picture\', replace_upload_index: \''+index+'\'}}">修改</a>' +
                        '<a class="layui-btn layui-btn-xs layui-btn-danger" onclick="this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode);" style="float: right">删除</a>' +
                        '</p>' +
                        '</div>'
                    );
                }
            }
        });
        $(document).on('click', '.cftoggleUpload', function () {
            $('.toggleUpload').attr('lay-data', $(this).attr('lay-data'));
            $('.toggleUpload').trigger('click');
        });
        $('.replaceUploadImg').selectImages({
            confirm:function(res,elem,data) {
                let replaceUploadObj = $('#'+data.data.replace_upload_index);
                replaceUploadObj.find('img').attr('src', res[0].src);
                replaceUploadObj.find('img').attr('alt', res[0].src);
                replaceUploadObj.find('input').val(res[0].src);
            }
        });
        //合同类型
        form.on('radio(sign_type)', function(elem) {
            if(elem.value == 2) {
                $('#sign_type_image').show()
                $('#sign_type_esign').hide()
            } else {
                $('#sign_type_image').hide()
                $('#sign_type_esign').show()
            }
        })
        // 涨租模式
        form.on('radio(is-rose)', function(data) {
            if(data.value == 1) {
                $('.is-rose').show();
                $('.rend-is-rose').hide();
            } else {
                $('.is-rose').hide();
                $('.rend-is-rose').show();
            }
        });
    });
</script>
{/block}